<template>
	<view class="afterSale">
		<zhu-nav-bar title="售后/退款" bgColor="#fff" leftColor="#000" sizeColor="#111"></zhu-nav-bar>
		<view class="afterSale-plate-1">
			<u-tabs :list="list" :is-scroll="false" bar-width="0" gutter="40" active-color="#367FFF" :current="current" @change="change"></u-tabs>
		</view>
		<view class="afterSale-plate-2">
					<view class="content">
						<order-title state="待退款" orderNum="E48129471085092853" rightText="12-18 16:37:48下单"></order-title>
						<order-goods :goodsImgUrl="require('@/static/img/financial/financial-top-bg.png')" goodsName="babycare儿童点读笔通用英语学习
		点读机幼儿小孩早教故事机益智" goodsDesc="点读笔16G+5张挂卡+16本书" goodsPrice="339.00" goodsNum="1" @click.native="goOrderDetail"></order-goods>
						<order-pay-price goodsNum="1" goodsPrice="339.00"></order-pay-price>
						<order-address address="陆** 186****1231 河南省郑州市金水区花园北路省直花园小区1单号楼1单元111" code="000000"></order-address>
						<view class="btm-btn" v-if="current == 0">
							<view class="btn-box">
								<navigator url="salesReturn/salesReturn" hover-class="none" open-type="navigate">
									<view class="btn">去处理</view>
								</navigator>
							</view>
						</view>
						<view class="btm-btn" v-if="current == 1">
							<view class="btn-box">
								<navigator url="awaitSalesReturn/awaitSalesReturn" open-type="navigate" hover-class="none">
									<view class="btn">等待退款</view>
								</navigator>
							</view>
						</view>
					</view>
				</view>
	</view>
</template>

<script>
	import zhuNavBar from '@/pages/components/zhuNavBar.vue'
	import orderTitle from '@/pages/components/orderTitle.vue'
	import orderGoods from '@/pages/components/orderGoods.vue'
	import orderPayPrice from '@/pages/components/orderPayPrice.vue'
	import orderAddress from '@/pages/components/orderAddress.vue'
	export default {
		data() {
			return {
				list: [{
					name: '申请退款',
					count: 1
				}, {
					name: '等待退货',
					count: 1
				}, {
					name: '退款拒绝',
					count: 1
				}],
				current: 0
			};
		},
		components: {
			zhuNavBar,
			orderTitle,
			orderGoods,
			orderPayPrice,
			orderAddress
		},
		methods:{
			// 操作组件tabs
			change(index) {
				this.current = index;
			}
		}
	}
</script>

<style lang="scss">
	.afterSale{
		width: 100vw;
		min-height: 100vh;
		background-color: #F9F9F9;
		.afterSale-plate-1{
			width: 100vw;
			padding-top: calc(88rpx + var(--status-bar-height));
		}
		.afterSale-plate-2{
			margin-top: 30rpx;
			.content{
				.btm-btn{
					background-color: #fff;
					padding: 0 30rpx;
					.btn-box{
						border-top: 1rpx solid #eee;
						height: 104rpx;
						display: flex;
						align-items: center;
						justify-content: flex-end;
						.btn{
							width: 160rpx;
							height: 50rpx;
							background: #ffffff;
							border: 1px solid #999999;
							border-radius: 25rpx;
							font-size: 24rpx;
							font-weight: 500;
							color: #333333;
							display: flex;
							align-items: center;
							justify-content: center;
						}
					}
		
				}
			}
		}
	}

</style>
